<template>
	<view :style="{height:screenHeight+'px'}" class="collection">
		<view class="new-label">
			<u-cell 
			icon="plus" 
			iconStyle="font-size:25px; font-weight:600; color:#0080FF;" 
			size="large" 
			title="新建标签"
			titleStyle="font-size:25px; color:#0080FF;font-weight:530;"
			:border="false"
			></u-cell>
		</view>
		<view class="lebel-length">
			共有{{labelGroup.length}}个标签
		</view>
		<view class="cell-group" >
			<u-cell-group :border="false" >
				<u-cell 
				v-for="label in labelGroup" :key="label.name" 
				:title="label.name"
				size="large"
				titleStyle="font-size:20px;font-weight:550;"
				isLink
				>
				</u-cell>
				</u-cell>
			</u-cell-group>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				 screenHeight: "",
				 labelGroup:[
					 {name:'未标签的'},
					 {name:'重要'},
					 {name:'常用'},
					 {name:'学习'},
				 ]
			}
		},
		onLoad() {
		        this.screenHeight = uni.getSystemInfoSync().windowHeight;
		},
		methods: {
			
		}
	}
</script>

<style lang="less">
	.collection{
		background-color: #F1F1F3;
		padding-top: 3%;
		.new-label{
			background-color: #FFFFFF;
			padding-top: 1%;
			padding-bottom: 1%;
		}
		.lebel-length{
			color: #909092;
			margin-left: 2%;
			margin-top: 5%;
			padding-bottom: 1%;
		}
		.cell-group{
			background-color: #FFFFFF;
		}
	}

</style>
